<template>
	<view class="mainCon">
		<view class="headForm">
			<u-form :model="formData" ref="uForm" label-width="160">
				<u-form-item label="委托号">
					<u-input v-model="formData.wtno" />
				</u-form-item>
				<u-form-item label="提单号">
					<u-input v-model="formData.tidanno" />
				</u-form-item> 
			</u-form>
			<view class="btnGroup">
				<u-button :custom-style="customStyle" type="primary" @click="onSearch">查询</u-button>
				<u-button :custom-style="customStyle" type="primary" @click="tapSelAll">全选</u-button>
				<u-button :custom-style="customStyle" type="primary" @click="tapredo">撤销</u-button>
			</view>
		</view>
		<view style="height: 300rpx;">

		</view>
		<view class="empty" style="margin-top: 50rpx;" v-if="list.length==0">
			<u-empty text="暂无相关数据" mode="list"></u-empty>
		</view>
		<view class="listCon">
			<view class="listItem" v-for="(item, index) in list" :key="index"> 
				<view class="infoCon" @click="selectitem(item)">
					<view class="checkBox">
						<u-checkbox v-model="item.checked"></u-checkbox>
					</view>
					<view>
						<view class="cellItem">
							<view class="label">
								提单号：
							</view>
							<view class="labelTag">
								{{item.TIDANNO}}
							</view>
						</view>  
						<view class="cellItem">
							<view class="label">
								委托号/序号：
							</view>
							<view class="labelTag">
								{{item.WTNO}}   /   {{item.TIDANXH}}
							</view>
						</view> 
						<view class="cellItem">
							<view class="label">
								箱号：
							</view>
							<view class="value">
								{{item.XH}}
							</view>
						</view>
						<view class="cellItem">
							<view class="label">
								箱尺：
							</view>
							<view class="value">
								{{item.XC}}{{item.XX}}
							</view>
						</view>
						<view class="cellItem">
							<view class="label">
								箱主：
							</view>
							<view class="value">
								{{item.XGS}}
							</view>
						</view>
					</view>  
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				customStyle: {
					height: '60rpx',
				},
				formData: {
					wtno: '',
					tidanno: ''
				},
				list: [],
				truckname: '林森物流集团有限公司', //uni.getStorageSync("nickName"),
				isCheckAll: false,
				editPhone: '',
				editcarcode: "",
				showEditpop: false,
				flag: false,
				baseUrl: 'https://api.zlkj-port.com/FLT'
			};
		},
		onLoad() {
			this.getList()
		},
		methods: {
			getList() {
				uni.showLoading({
					title: '加载中...'
				}) 
				uni.request({
					// url: 'https://api.zlkj-port.com/szgjapi/zlzg/Q/j1VNofSgPrwQ5hM?WTNO='+this.formData.wtno+'&TIDANNO=' + this.formData
					// 	.tidanno + '&uname=' + this.truckname,
					url: this.baseUrl + '/zlkj/wechat/qxzyList',
					method: "post",
					data: {
						truckname: this.truckname,
						wtno: this.formData.wtno,
						tidanno: this.formData.tidanno
					},
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					success: (res) => {
						this.isCheckAll = false
						res.data.rows.forEach((item) => {
							item.checked = false
						})
						this.list = res.data.rows
						uni.hideLoading()
					}
				})
			},
			tapSelAll() {
				if (this.isCheckAll) {
					this.list.forEach((item) => {
						item.checked = false
					})
					this.isCheckAll = false
				} else {
					this.isCheckAll = true
					this.list.forEach((item) => {
						item.checked = true
					})
				}
			},
			onSearch() {
				this.getList()
			},
			selectitem(item) {
				if (item.checked == false) {
					item.checked = true
				} else {
					item.checked = false
				}
			}, 
			tapredo() { 
				let checkList = []
				this.list.forEach((item) => {
					if(item.checked){
						checkList.push(item.ID) 
					}
				}) 
				if (checkList.length == 0 || this.list.length == 0) return uni.showToast({
					title: '请选择数据',
					icon: 'none'
				}) 
				uni.showModal({
				    title: '提示',
				    content: '取消后需上级重新指派，确定要取消作业？',
				    success: function (res) {
				        if (res.confirm) {
				           uni.request({
				           	// url: 'https://api.zlkj-port.com/szgjapi/zlzg/D/egQObrwrWhr7RSF',
				           	url: this.baseUrl + '/zlkj/wechat/delqx',
							data: { 
				           		ids: checkList.toString(),
				           		// WTNO:this.formData.wtno,
				           		// TIDANNO:this.formData.tidanno,
				           		// uname:this.truckname
				           	},
				           	header: {
				           		'Content-Type': 'application/x-www-form-urlencoded'
				           	},
				           	method: "POST",
				           	success: (res) => { 
				           		uni.showToast({
				           			title: '撤销成功'
				           		}) 
				           		setTimeout( () => {
				           		   this.getList()
				           		}, 1000)
				           	},
				           	fail() {
				           		uni.showToast({
				           			title: '撤销失败'
				           		})
				           	}
				           }) 
				        }  
				    }.bind(this)
				}); 
			}
		}
	}
</script>

<style lang="scss" scoped>
	::v-deep .u-form-item {
		padding: 6rpx !important;
	}

	.mainCon {
		.headForm {
			padding: 20rpx;
			position: fixed;
			width: 100%;
			top: 0;
			z-index: 10;
			background-color: #FFFFFF;

			.btnGroup {
				display: flex;
				justify-content: space-around;
				align-items: center;
				margin-top: 15rpx;
			}
		}
	} 

	.listCon {

		.listItem {
			margin-left:10px;
			padding: 20rpx;
			border-bottom: 1px solid $u-border-color;
			display: flex;
			align-items: center; 
			.infoCon { 
				display: flex;
				align-items: center;
				justify-content: space-between;
				.checkBox {}
				.cellItem {
					display: flex;
					align-items: center;
					font-size: 28rpx;

					.label {}
				}

				.edit {

					color: #FF1F1C;
				}
				.labelTag {
					background-color: #E0EDFB;
					color: #4C86E7; 
					line-height: 50rpx;
					border-radius: 25rpx;
					font-size: 26rpx;
					text-align: center;
					padding-right: 15rpx;
					padding-left: 15rpx;
				}
			}
		}
	}
</style>
